<template>
  <div class="all">
    <Header>
      <span slot="middle">评论详情</span>
    </Header>

    <!-- 展示评论 -->
    <h2>精彩热评</h2>
    <div v-for="item in hotComments" :key="item.commentId" class="ping">
      <p>{{ item.content }}</p>
      <span>{{ item.timeStr }}</span>
      <van-divider :style="{ color: '#1989fa', borderColor: '#1989fa',  }"/>
    </div>
  </div>
</template>

<script>
import Header from "../../components/NavBar.vue";
import { getplaywirteAPI } from "../../api/music";
export default {
  data() {
    return {
      hotComments: [],
    };
  },
  computed: {},
  watch: {},

  methods: {
    //获取评论
    async getping(id) {
      const result = await getplaywirteAPI(id);
      console.log(result);
      this.hotComments = result.hotComments;
    },
  },
  created() {
    const id = this.$route.params.id;
    this.getping(id);
  },
  mounted() {},
  components: {
    Header,
  },
};
</script>
<style scoped>
.ping {
  padding: 10px;
}
.all{
    background-color: #7FFFD4;
}
</style>